<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">

    <title>打散文字随机浮动特效</title>
    <link rel="stylesheet" href="170.css">
</head>

<body>
    <article>
        <p id="text">你说帘外海棠，锦屏鸳鸯；后来庭院春深，咫尺画堂。你说笛声如诉，费尽思量；后来茶烟尚绿，人影茫茫。你说可人如玉，与子偕臧；后来长亭远望，夜色微凉。你说霞染天光，陌上花开与谁享；后来烟笼柳暗，湖心水动影无双。你说彼岸灯火，心之所向；后来渔舟晚唱，烟雨彷徨。你说水静莲香，惠风和畅；后来云遮薄月，清露如霜。你说幽窗棋罢，再吐衷肠；后来风卷孤松，雾漫山冈。你说红袖佯嗔，秋波流转思张敞；后来黛眉长敛，春色飘零别阮郎。你说暗香浮动，刹那光芒；后来玉殒琼碎，疏影横窗。你说良辰美景，乘兴独往；后来红尘紫陌，雪落太行。你说赋尽高唐，三生石上；后来君居淄右，妾家河阳。你说玉楼朱颜，飞月流觞迎客棹；后来幽谷居士，枕琴听雨卧禅房。你说高山流水，客答春江；后来章台游冶，系马垂杨。你说锦瑟韶光，华灯幢幢；后来荼蘼开至，青苔满墙。你说天地玄黄，风月琳琅；后来月斜江上，云淡天长。</p>
        <button id="btn">放松一下</button>
    </article>
</body>

</html>

<!-- 引入插件 -->
<script src="neontext.min.js"></script>
<script>
    // 要操作的元素
    // 按钮
    const resetBtn=document.getElementById('btn');
    // 初始化
    const neontext=new Neontext('text');
    // 打乱文字
    neontext.render.run();

    // 为按钮绑定点击事件
    resetBtn.addEventListener('click',function(){
        // 文字恢复
        neontext.render.killer();
    })
</script>